<template>
  <div class="menu-div">
    <Drawer title="" placement="left" width="1283" :closable="false" v-model="drawer">
      <div class="menu-search-div">
        <Input placeholder="请输入功能关键词" type="text" v-model="searchText" class="search-input">
            <Icon type="ios-search" slot="prefix" />
        </Input>
        <div class="search-btn" @click="clickSearch()">搜 索</div>
        <img :src="closeImg" @click="closeMenu" alt="" style="width:30px;height:30px;float:right;cursor: pointer;">
      </div>
      <div class="menu-cotent-div">
        <Row>
          <Col span="6">
            <img :src="qstbImg" v-if="menuList2.length >= 0 && !menu_flag2" class="img-div" alt="">
            <img :src="qstbwuImg" v-if="menuList2.length == 0 && menu_flag2" class="img-div" alt="">
            <img :src="wqxImg" v-show="menuList2.length == 0  && menu_flag2" class="wuimg-div" alt="">
            <img :src="wsjImg" v-show="menuList2.length == 0  && !menu_flag2" class="wuimg-div" alt="">
            <div>
              <Menu theme="primary" @on-select="clickMenuQstb" style="width: 260px;background-color: #ffffff;">
                  <div v-for="(item, index) in menuList2" v-bind:key="index" class="menu-title2" v-if="!item.list">
                      <MenuItem :name="item.path || ''" class="menu-title1">
                          {{item.name}}
                      </MenuItem>
                  </div>
                  <div v-for="(item, index) in menuList2" v-bind:key="index" class="menu-title2" v-if="item.list">
                    <MenuGroup :title="item.name" class="menu-title2">
                      <div v-for="(item1, index1) in item.list" v-bind:key="index1">
                        <MenuItem :name="item1.path || ''" class="menu-title1">
                            {{item1.name}}
                        </MenuItem>
                      </div>
                    </MenuGroup>
                  </div>
              </Menu>
            </div>
          </Col>
          <Col span="6">
            <img :src="yqfkImg" v-if="menuList3.length >= 0 && !menu_flag3" class="img-div" alt="">
            <img :src="yqfkwuImg" v-if="menuList3.length == 0 && menu_flag3" class="img-div" alt="">
            <img :src="wqxImg" v-show="menuList3.length == 0  && menu_flag3" class="wuimg-div" alt="">
            <img :src="wsjImg" v-show="menuList3.length == 0  && !menu_flag3" class="wuimg-div" alt="">
            <div>
              <Menu @on-select="clickMenu">
                <div v-for="(item, index) in menuList3" v-bind:key="index" class="menu-title2">
                  <MenuGroup :title="item.name" class="menu-title2">
                    <div v-for="(item1, index1) in item.list" v-bind:key="index1">
                      <MenuItem :name="item1.path || ''" class="menu-title1">
                          {{item1.name}}
                      </MenuItem>
                    </div>
                  </MenuGroup>
                </div>
              </Menu>
            </div>
          </Col>
          <Col span="6">
            <img :src="wghImg" v-show="menuList.length >= 0  && !menu_flag" class="img-div" alt="">
            <img :src="wghwuImg" v-show="menuList.length == 0  && menu_flag" class="img-div" alt="">
            <img :src="wqxImg" v-show="menuList.length == 0  && menu_flag" class="wuimg-div" alt="">
            <img :src="wsjImg" v-show="menuList.length == 0  && !menu_flag" class="wuimg-div" alt="">
            <div>
              <Menu theme="primary" @on-select="clickMenuWgh" style="width: 260px;background-color: #ffffff;">
                  <div v-for="(item, index) in menuList" v-bind:key="index" class="menu-title2" v-if="!item.list">
                      <MenuItem :name="item.path || ''" class="menu-title1">
                          {{item.name}}
                      </MenuItem>
                  </div>
                  <div v-for="(item, index) in menuList" v-bind:key="index" class="menu-title2" v-if="item.list">
                    <MenuGroup :title="item.name" class="menu-title2">
                      <div v-for="(item1, index1) in item.list" v-bind:key="index1">
                        <MenuItem :name="item.path || ''" class="menu-title1">
                            {{item1.name}}
                        </MenuItem>
                      </div>
                    </MenuGroup>
                  </div>
              </Menu>
            </div>
          </Col>
          <Col span="6">
            <img :src="smzImg" v-if="menuList1.length >= 0 && !menu_flag1" class="img-div" alt="">
            <img :src="smzwuImg" v-if="menuList1.length == 0 && menu_flag1" class="img-div" alt="">
            <img :src="wqxImg" v-show="menuList1.length == 0  && menu_flag1" class="wuimg-div" alt="">
            <img :src="wsjImg" v-show="menuList1.length == 0  && !menu_flag1" class="wuimg-div" alt="">
            <div>
              <Menu  @on-select="clickMenuSmz">
                <div v-for="(item, index) in menuList1" v-bind:key="index" class="menu-title2">
                  <MenuGroup :title="item.name" class="menu-title2">
                    <div v-for="(item1, index1) in item.list" v-bind:key="index1">
                      <MenuItem :name="item1.path || ''" class="menu-title1">
                          {{item1.name}}
                      </MenuItem>
                    </div>
                  </MenuGroup>
                </div>
              </Menu>
            </div>
          </Col>
        </Row>
      </div>
    </Drawer>
  </div>
</template>
<script>
import './index.less'
import qstbImg from '@/assets/images/new-grid/qstb.png'
import smzImg from '@/assets/images/new-grid/smz.png'
import wghImg from '@/assets/images/new-grid/wgh.png'
import yqfkImg from '@/assets/images/new-grid/yqfk.png'
import qstbwuImg from '@/assets/images/new-grid/qstb-wu.png'
import smzwuImg from '@/assets/images/new-grid/smz-wu.png'
import wghwuImg from '@/assets/images/new-grid/wgh-wu.png'
import yqfkwuImg from '@/assets/images/new-grid/yqfk-wu.png'
import wqxImg from '@/assets/images/new-grid/wqx.png'
import wsjImg from '@/assets/images/new-grid/暂无数据.png'
import closeImg from '@/assets/images/new-grid/关闭.png'
export default {
  name: 'menu-list',
  data () {
    return {
      wsjImg,
      closeImg,
      searchText: '',
      drawer: false,
      qstbImg,
      smzImg,
      wghImg,
      yqfkImg,
      qstbwuImg,
      smzwuImg,
      wghwuImg,
      yqfkwuImg,
      wqxImg,
      menuName: [],
      login_url: ''
    }
  },
  props: {
    menuList: {
      type: Array,
      default () {
        return []
      }
    },
    menuList1: {
      type: Array,
      default () {
        return []
      }
    },
    menuList2: {
      type: Array,
      default () {
        return []
      }
    },
    menuList3: {
      type: Array,
      default () {
        return []
      }
    },
    menu_flag: {
      type: Boolean,
      default () {
        return false
      }
    },
    menu_flag1: {
      type: Boolean,
      default () {
        return false
      }
    },
    menu_flag2: {
      type: Boolean,
      default () {
        return false
      }
    },
    menu_flag3: {
      type: Boolean,
      default () {
        return false
      }
    }
  },
  mounted () {
    this.login_url = window.location.href
    console.log(this.menu_flag, 'shifou xianshi')
  },
  methods: {
    closeMenu () {
      this.drawer = false
    },
    clickSearch () {
      this.$emit('getSearchMenu', this.searchText)
    },
    clickMenu (name) { // 疫情
      console.log('fafdsafd', name, this.login_url)
      if (this.login_url.indexOf('http://qstb') !== -1) { // 生产环境
        window.open('http://qstb.mzj.shenyang.gov.cn/yiqing/#' + name)
      } else if (this.login_url.indexOf('http://iview.tripln.top') !== -1) { // 测试环境
        window.open('http://iview.tripln.top/yiqing/#' + name)
      } else { // 本地
        this.$router.push({
          path: name
        })
        this.drawer = false
      }
    },
    clickMenuWgh (name) {
      if (this.login_url.indexOf('http://qstb') !== -1) { // 生产环境
        window.open('http://qstb.mzj.shenyang.gov.cn/grid/#' + name)
      } else if (this.login_url.indexOf('http://iviewys.tripln.top') !== -1) { // 测试环境
        window.open('http://iviewys.tripln.top/shenbgrid/#' + name)
      } else { // 本地
        console.log('不跳转')
      }
    },
    clickMenuSmz (name) {
      if (this.login_url.indexOf('http://qstb') !== -1) { // 生产环境
        window.open('http://qstb.mzj.shenyang.gov.cn/worker/#' + name)
      } else if (this.login_url.indexOf('http://iviewys.tripln.top') !== -1) { // 测试环境
        window.open('http://iviewys.tripln.top/worker/#' + name)
      } else { // 本地
        console.log('不跳转')
      }
    },
    clickMenuQstb (name) {
      if (this.login_url.indexOf('http://qstb') !== -1) { // 生产环境
        window.open('http://qstb.mzj.shenyang.gov.cn/#' + name)
      } else if (this.login_url.indexOf('http://iviewys.tripln.top') !== -1) { // 测试环境
        window.open('http://iviewys.tripln.top/#' + name)
      } else { // 本地
        this.$router.push({
          path: name
        })
        this.drawer = false
      }
    },
    handleSelect () {},
    open () {
      this.drawer = true
    },
    getSearchFlag (flag) {
      this.menu_flag = flag
      console.log(this.menu_flag, '$$$$$')
    }
  }
}
</script>
<style scoped>
  .menu-div .ivu-drawer-body {
    padding: 30px;
  }
  .menu-cotent-div .ivu-menu-vertical.ivu-menu-light:after {
    content: '';
    display: block;
    width: 0px;
    height: 100%;
    background: #dcdee2;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
  }
  .menu-cotent-div .ivu-menu-vertical .ivu-menu-item, .ivu-menu-vertical .ivu-menu-submenu-title {
    padding: 7.5px 10px;
  }
  .menu-cotent-div .ivu-menu-vertical .ivu-menu-item:hover, .ivu-menu-vertical .ivu-menu-submenu-title:hover {
    color: #515151;
  }
  .menu-cotent-div .ivu-menu-light.ivu-menu-vertical .ivu-menu-item-active:not(.ivu-menu-submenu) {
    color: #515151;
    background: white;
    z-index: 2;
  }
  .menu-cotent-div  >>> .ivu-menu-item-group-title {
    font-family: "PingFang SC Bold";
    font-weight: 700;
    font-size: 14px;
    text-align: left;
    color: #b40001;
    padding-left: 10px;
  }
  .menu-cotent-div  >>> .ivu-layout-sider-children, .ivu-menu-light {
    background-color: #ffffff;
  }
  .menu-cotent-div >>> .ivu-btn-primary:hover {
    color: #fff;
    background-color: red;
    border-color: red;
  }
  .search-btn >>> .a:hover {
    color: #fff;
  }
  .search-input .ivu-input-with-prefix {
    box-shadow: none;
  }
</style>
